<template>
    <div class="space_left">
        <div class="userTop clear">
            <h1 class="recipe_De_title"><a href="https://home.meishichina.com/recipe-425022.html" id="recipe_title" title="凉拌萝卜丝">凉拌萝卜丝</a>
            </h1>
         
        </div>
        <div class="recipDetail">
            
            <div class="recipe_De_imgBox" id="recipe_De_imgBox">
                <a class="J_photo" title="凉拌萝卜丝的做法"><span></span><img src="https://i8.meishichina.com/attachment/recipe/2018/10/31/20181031154096113025610602320.jpg?x-oss-process=style/p800" alt="凉拌萝卜丝的做法"> </a>
                <p class="J_photo">
                    <span class="De_bg">&nbsp;</span>
                    <span class="De_photo">4张图片</span>
                </p>
            </div>
            <blockquote class="block_txt" id="block_txt">
                <div id="block_txt1"><span class="txt_tart">“</span>现在正值萝卜大量上市的时节，一个个水灵灵的，特别想抱回家。<br>
                    今天来分享一下这个凉拌萝卜丝的做法，加入嫩姜是关键。嫩姜口感脆嫩，辣味小，跟甜甜的萝卜丝配在一起，口感丰富！<span class="txt_end">” </span>
                </div>
            </blockquote>
            <div class="mo mt20">
                <h3>食材明细</h3>
            </div>
            <fieldset class="particulars">
                <legend>主料</legend>
                <div class="recipeCategory_sub_R clear">
                    <ul style="border-radius: 10px;">
                        <li>
                            <span class="category_s1">
                                <a target="_blank" href="https://www.meishichina.com/YuanLiao/LuoBo/" title="萝卜的做法"><b>萝卜</b></a>
                            </span>
                            <span class="category_s2">1根</span>
                        </li>
                        <li>
                            <span class="category_s1">
                                <b>嫩姜</b>
                            </span>
                            <span class="category_s2">1-2块</span>
                        </li>
                        <li>
                            <span class="category_s1">
                                <a target="_blank" href="https://www.meishichina.com/YuanLiao/HuLuoBo/" title="胡萝卜的做法"><b>胡萝卜</b></a>
                            </span>
                            <span class="category_s2">1根</span>
                        </li>
                        <li>
                            <span class="category_s1">
                                <a target="_blank" href="https://www.meishichina.com/YuanLiao/DuoJiao/" title="剁椒的做法"><b>剁椒</b></a>
                            </span>
                            <span class="category_s2">2勺</span>
                        </li>
                        <li>
                            <span class="category_s1">
                                <a target="_blank" href="https://www.meishichina.com/YuanLiao/Yan/" title="盐的做法"><b>盐</b></a>
                            </span>
                            <span class="category_s2">2-3勺</span>
                        </li>
                        <li>
                            <span class="category_s1">
                                <a target="_blank" href="https://www.meishichina.com/YuanLiao/MianBaiTang/" title="糖的做法"><b>糖</b></a>
                            </span>
                            <span class="category_s2">1匙</span>
                        </li>
                        <li>
                            <span class="category_s1">
                                <a target="_blank" href="https://www.meishichina.com/YuanLiao/HuaJiaoYou/" title="花椒油的做法"><b>花椒油</b></a>
                            </span>
                            <span class="category_s2">1勺</span>
                        </li>
                    </ul>
                </div>
            </fieldset>
            <fieldset class="particulars">
                <legend>辅料</legend>
                <div class="recipeCategory_sub_R clear">
                    <ul>
                        <li>
                            <span class="category_s1">
                                <a target="_blank" href="https://www.meishichina.com/YuanLiao/XiangCai/" title="香菜的做法"><b>香菜</b></a>
                            </span>
                            <span class="category_s2">少许（点缀）</span>
                        </li>
                    </ul>
                </div>
            </fieldset>
            <div class="recipeCategory_sub_R mt30 clear">
                <ul>
                    <li>
                        <span class="category_s1">
                            <a title="微辣" href="https://home.meishichina.com/recipe-type-do-cuisine-view-1.html" target="_blank">微辣</a>
                        </span>
                        <span class="category_s2">口味</span>
                    </li>
                    <li>
                        <span class="category_s1">
                            <a title="拌" href="https://home.meishichina.com/recipe-type-do-technics-view-8.html" target="_blank">拌</a>
                        </span>
                        <span class="category_s2">工艺</span>
                    </li>
                    <li>
                        <span class="category_s1">
                            <a title="三刻钟" href="https://home.meishichina.com/recipe-type-do-during-view-4.html" target="_blank">三刻钟</a>
                        </span>
                        <span class="category_s2">耗时</span>
                    </li>
                    <li>
                        <span class="category_s1">
                            <a title="简单" href="https://home.meishichina.com/recipe-type-do-level-view-1.html" target="_blank">简单</a>
                        </span>
                        <span class="category_s2">难度</span>
                    </li>
                </ul>
            </div>
            <div class="mo mt20">
                <h3>凉拌萝卜丝的做法步骤</h3>
            </div>
            <div class="recipeStep">
                <ul>
                    <li>
                        <div class="recipeStep_img">
                            <img src="https://i8.meishichina.com/attachment/recipe/2018/10/31/20181031154096042165510602320.jpg?x-oss-process=style/p320" alt="凉拌萝卜丝的做法步骤：1">
                        </div>
                        <div class="recipeStep_word">
                            <div class="recipeStep_num">1</div>萝卜、胡萝卜、姜去皮。
                        </div>
                    </li>
                    <li>
                        <div class="recipeStep_img">
                            <img src="https://i8.meishichina.com/attachment/recipe/2018/10/31/20181031154096041437310602320.jpg?x-oss-process=style/p320" alt="凉拌萝卜丝的做法步骤：2">
                        </div>
                        <div class="recipeStep_word">
                            <div class="recipeStep_num">2</div>用刨丝器把萝卜和胡萝卜🥕擦成丝。
                        </div>
                    </li>
                    <li>
                        <div class="recipeStep_img">
                            <img src="https://i8.meishichina.com/attachment/recipe/2018/10/31/20181031154096047086910602320.jpg?x-oss-process=style/p320" alt="凉拌萝卜丝的做法步骤：3">
                        </div>
                        <div class="recipeStep_word">
                            <div class="recipeStep_num">3</div>加入1勺盐给它们杀一下水，盐要看萝卜大小，适量增减。
                        </div>
                    </li>
                    <li>
                        <div class="recipeStep_img">
                            <img src="https://i8.meishichina.com/attachment/recipe/2018/10/31/20181031154096047164810602320.jpg?x-oss-process=style/p320" alt="凉拌萝卜丝的做法步骤：4">
                        </div>
                        <div class="recipeStep_word">
                            <div class="recipeStep_num">4</div>拌匀，腌制10-15分钟。
                        </div>
                    </li>
                    <li>
                        <div class="recipeStep_img">
                            <img src="https://i8.meishichina.com/attachment/recipe/2018/10/31/20181031154096048273710602320.jpg?x-oss-process=style/p320" alt="凉拌萝卜丝的做法步骤：5">
                        </div>
                        <div class="recipeStep_word">
                            <div class="recipeStep_num">5</div>姜切成细丝，我比较喜欢吃生姜，放的多、随个人喜好增减。
                        </div>
                    </li>
                    <li>
                        <div class="recipeStep_img">
                            <img src="https://i8.meishichina.com/attachment/recipe/2018/10/31/20181031154096047530910602320.jpg?x-oss-process=style/p320" alt="凉拌萝卜丝的做法步骤：6">
                        </div>
                        <div class="recipeStep_word">
                            <div class="recipeStep_num">6</div>15分钟后已经析出很多水份了。
                        </div>
                    </li>
                    <li>
                        <div class="recipeStep_img">
                            <img src="https://i8.meishichina.com/attachment/recipe/2018/10/31/20181031154096047852310602320.jpg?x-oss-process=style/p320" alt="凉拌萝卜丝的做法步骤：7">
                        </div>
                        <div class="recipeStep_word">
                            <div class="recipeStep_num">7</div>挤干水份。
                        </div>
                    </li>
                    <li>
                        <div class="recipeStep_img">
                            <img src="https://i8.meishichina.com/attachment/recipe/2018/10/31/20181031154096046874210602320.jpg?x-oss-process=style/p320" alt="凉拌萝卜丝的做法步骤：8">
                        </div>
                        <div class="recipeStep_word">
                            <div class="recipeStep_num">8</div>加入姜丝和剁椒。
                        </div>
                    </li>
                    <li>
                        <div class="recipeStep_img">
                            <img src="https://i8.meishichina.com/attachment/recipe/2018/10/31/20181031154096048050010602320.jpg?x-oss-process=style/p320" alt="凉拌萝卜丝的做法步骤：9">
                        </div>
                        <div class="recipeStep_word">
                            <div class="recipeStep_num">9</div>盐2勺。
                        </div>
                    </li>
                    <li>
                        <div class="recipeStep_img">
                            <img src="https://i8.meishichina.com/attachment/recipe/2018/10/31/20181031154096050610010602320.jpg?x-oss-process=style/p320" alt="凉拌萝卜丝的做法步骤：10">
                        </div>
                        <div class="recipeStep_word">
                            <div class="recipeStep_num">10</div>适量糖提鲜。
                        </div>
                    </li>
                    <li>
                        <div class="recipeStep_img">
                            <img src="https://i8.meishichina.com/attachment/recipe/2018/10/31/20181031154096050768410602320.jpg?x-oss-process=style/p320" alt="凉拌萝卜丝的做法步骤：11">
                        </div>
                        <div class="recipeStep_word">
                            <div class="recipeStep_num">11</div>花椒油少许。
                        </div>
                    </li>
                    <li>
                        <div class="recipeStep_img">
                            <img src="https://i8.meishichina.com/attachment/recipe/2018/10/31/20181031154096050021310602320.jpg?x-oss-process=style/p320" alt="凉拌萝卜丝的做法步骤：12">
                        </div>
                        <div class="recipeStep_word">
                            <div class="recipeStep_num">12</div>用筷子拌匀，尝一下咸淡，腌制20-30分钟。
                        </div>
                    </li>
                    <li>
                        <div class="recipeStep_img">
                            <img src="https://i8.meishichina.com/attachment/recipe/2018/10/31/20181031154096126019310602320.jpg?x-oss-process=style/p320" alt="凉拌萝卜丝的做法步骤：13">
                        </div>
                        <div class="recipeStep_word">
                            <div class="recipeStep_num">13</div>爽口辛辣的凉拌萝卜丝就做好了，开动吧。
                        </div>
                    </li>
                    <li>
                        <div class="recipeStep_img">
                            <img src="https://i8.meishichina.com/attachment/recipe/2018/10/31/20181031154096123773910602320.jpg?x-oss-process=style/p320" alt="凉拌萝卜丝的做法步骤：14">
                        </div>
                        <div class="recipeStep_word">
                            <div class="recipeStep_num">14</div>喜欢吗？动手试一下哦！
                        </div>
                    </li>
                    <li>
                        <div class="recipeStep_img">
                            <img src="https://i8.meishichina.com/attachment/recipe/2018/10/31/20181031154096127495710602320.jpg?x-oss-process=style/p320" alt="凉拌萝卜丝的做法步骤：15">
                        </div>
                        <div class="recipeStep_word">
                            <div class="recipeStep_num">15</div>来个特写😊
                        </div>
                    </li>
                </ul>
            </div>
            
        </div>
        <share-save></share-save>
    </div>
</template>
<script>
import shareSave from '../common/share'
export default {
  data() {
    return {};
  },
  components:{
      shareSave
  }
};
</script>
<style  lang="stylus" scoped rel="stylesheet/stylus">
.space_left 
    width:100%
    height:100%
    & .recipe_De_title 
        font-size: 32px
        color: #333
        display: flex
    & .recipDetail
        width:100%
        .txt_tart 
            font-size: 40px
            font-family: "宋体"  "Hiragino Sans GB" " 微软雅黑" "Microsoft YaHei"
            color: rgb(191, 191, 191)
            height: 16px
            line-height: 100%
            width: 30px
            display: inline-block
            overflow: hidden
        & .mo
            font-size: 20px;
            color: #ff6767;
            font-size: 20px;
            line-height: 20px;
            padding: 20px 0 20px 25px;
            background: rgba(0,0,0,0) url(//static.meishichina.com/v6/img/mo.png) no-repeat scroll left center;
            text-align: left;
        & .particulars
                border-radius: 10px
                border: 1px solid #ddd
                padding: 0 0 10px 0
                margin: 0 0 15px 0
                & legend 
                    font-size: 16px;
                    margin: 0 35px;
                    padding: 0 10px;
                    text-align: left;
         & .recipeCategory_sub_R ul
            display:flex
            flex-wrap:wrap
            & li
                list-style: none;
                width: 137px;
                text-align: center;
                height: 70px;
                position: relative;
                padding: 21px 0px;
    & .recipeStep ul
        & li 
            display:flex
            margin-bottom :7px
          & .recipeStep_img
            width:200px
            padding: 0px 4px;
            margin-right: 2px;
          & .recipeStep_word
                    display: flex;
                    flex-direction: column;
                    flex: 1;
                    justify-content: center;
                    align-items: center;
                & .recipeStep_num
                        border: 1px solid #ddd;
                        border-radius: 50%;
                        font-size: 18px;
                        height: 34px;
                        width: 34px;
                        line-height: 34px;
                        margin-bottom: 16px;

</style>


